 <template>
	<view>
		
		<!--主体-->
		<view class="meMain">
			<view class="mePosition">
				<view class="meOverBg uni-bold" v-if="content">
					<!-- <view class="description"><text>{{content}}</text></view> -->
					<view v-html="content" ></view>
				</view>
				<view class="noCard" v-if="!content">暂无信息</view>	
			</view>
		</view>
		<!--主体-->
		
	</view>
</template>

<script>
	import {getReadme,renderMarkdown} from '../../utils/api/repo.js'
	export default{
		data(){
			return{				
				name : '',
				repo : "",
				content: '',
				
				
				html : ""
				
			}
		},
		onLoad(e) {
			uni.showLoading({
					
			})
			this.name = e.name ? e.name : 'sentsin'
			this.repo = e.repo ? e.repo : 'layui'
			uni.setNavigationBarTitle({
				title: "README"
			})
			getReadme(this.name,this.repo).then(res => {
				uni.hideLoading()
				let data = res.data
				if(data.content){
					this.base64ToString(data.content)
				}
				console.log(this.content)
			}).catch(res=>{uni.hideLoading();this.content = '';})
		},
		onShow() {},
		methods:{
			
			base64ToString(data){
				let res = decodeURIComponent(escape(atob(data)));
				let html = res
				uni.showLoading({
					
				})
				renderMarkdown(res).then(res => {
					uni.hideLoading()
					this.content = res.data
				}).catch(res => {uni.hideLoading();	this.content = html})
			}
		}
	}
</script>

<style>
	page{ background: #F5F5F5; }
	.meMain{ width: 100%;position: relative; }
	.meMain .imageback{ width: 100%;height: 220upx;display: block; background-color: #50B7EA;}
	.meMainBox{ width: 92%;margin: 0 auto; }
	.mePosition{ position: absolute;top: 0;left: 0;width: 100%; }
	.description {font-size: 32rpx;padding-left:20rpx;padding-right: 20rpx;}
	.meOverBg{ background: #FFFFFF;overflow: hidden;border-radius: 30rpx;margin:20rpx }
	.noCard {
		width: 90%;
		height: 200upx;
		margin: auto;
		background-color: white;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #999999;
		box-shadow: 0 0 10upx 0 rgba(0, 0, 0, 0.1);
		border-radius: 10upx;
		margin-top: 30rpx;
	}
</style>
